/**
 * Created by guoshuyu on 2017/2/10.
 */

import React, {
    Component,
} from 'react';
import PropTypes from 'prop-types';
import {
    Text,
    Image,
    View,
    StyleSheet,
    TouchableOpacity,
    Dimensions,
} from 'react-native';

import * as Constant from '../../style/constant'
import styles, {padding} from '../../style'
import {AppIcon} from "../../assets/icon/AppIcon";


export enum TabIconPath {
    Main = "shouye",
    Mine = "wode",
    Product = "quanbu",
    Cert = "liebiaogouwuche",
}


/**
 * 底部Tab
 */
class TabIcon extends Component {

    constructor(props) {
        super(props)
    }

    public props: {
        tabIconName: string,
        tabName?: string,
        tabTitle: string,
        focused: boolean,
    };
    static propTypes = {
        focused: PropTypes.bool,
        tabTitle: PropTypes.string,
        tabName: PropTypes.string,
        tabIconName: PropTypes.string,
    };

    render() {

        let iconPath = this.props.tabIconName;

        let color = this.props.focused ? Constant.tabSelectedColor : Constant.tabUnSelectColor;

        return (
            <View style={[styles.centerH,styles.justifyBetween,styles.flex,padding(5,0)]}>
                <AppIcon name={iconPath} size={Constant.tabMiniIconSize} color={color}/>
                <Text style={[{color: color}, {fontSize: 14, marginTop:3}]}>{this.props.tabTitle}</Text>
            </View>
        );
    }
}


export default TabIcon;